<template>
  <f-card :title="title" :hasBottomLine="hasBottomLine">
    <template slot="right">
      <slot name="left"></slot>
      <el-button
        v-show="!noEdit && isDetail && !isEdit"
        type="primary"
        @click="$emit('update:isEdit', true)"
        size="medium"
        icon="el-icon-edit"
        v-auth="editAuth"
        >编辑</el-button
      >
      <el-button
        v-show="!nodelete && isDetail && !isEdit"
        type="danger"
        @click="doDelete"
        size="medium"
        icon="el-icon-delete"
        v-auth="deleteAuth"
        >删除</el-button
      >
      <slot name="right"></slot>
    </template>
    <slot></slot>
    <div class="card-bottom">
      <template v-if="!isDetail || isEdit">
        <el-button round @click="cancel" plain>取消</el-button>
        <el-button type="primary" round @click="submitForm" v-auth="editAuth"
          >确认提交</el-button
        >
      </template>
      <el-button v-else round @click="goBack" plain>返回上一页</el-button>
      <slot name="bottom"></slot>
    </div>
  </f-card>
</template>
<script>
export default {
  props: {
    isEdit: {
      type: Boolean,
      required: true
    },
    isDetail: {
      type: Boolean,
      required: true
    },
    title: String,
    hasBottomLine: {
      type: Boolean,
      default() {
        return true
      }
    },
    noEdit: {
      type: Boolean,
      default() {
        return false
      }
    },
    nodelete: {
      type: Boolean,
      default() {
        return false
      }
    },
    del_text: {
      type: String,
      default() {
        return '项'
      }
    },
    editAuth: {
      type: [String, Boolean],
      default() {
        return true
      }
    },
    deleteAuth: {
      type: [String, Boolean],
      default() {
        return true
      }
    }
  },
  data() {
    return {}
  },
  methods: {
    submitForm() {
      this.$emit('submit')
    },
    cancel() {
      this.$emit('cancel')
    },
    goBack() {
      this.$router.go(-1)
    },
    doDelete() {
      Tip.confirm(`确认要删除此${this.del_text}吗？`, '删除提示', {
        confirmButtonText: '确认删除'
      })
        .then(async () => {
          this.$emit('delete')
        })
        .catch(() => {})
    }
  }
}
</script>
<style lang="less" scoped></style>
